<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>  
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>订餐</title>

 <link href="../resources/css/ligerui-all.css" rel="stylesheet" type="text/css" />
 <link href="../resources/css/jquery-ui-1.9.2.custom.min.css" rel="stylesheet"  type="text/css" />
 
  <script src="../resources/js/jquery-1.9.1.min.js" type="text/javascript"></script>  
  <script src="../resources/js/jquery-ui-1.9.2.custom.min.js" type="text/javascript"></script>
  <script src="../resources/js/ligerui.min.js" type="text/javascript"></script>
  <script src="../resources/js/jquery.ui.core.js" type="text/javascript"></script>
  <script src="../resources/js/jquery.ui.spinner.js" type="text/javascript"></script>
  
         <script type="text/javascript">
		 		var dish = [];//点的菜
				var countMenu = 0;//点了多少个菜啊？
				var totalPrice = 0;//总共多少钱啊？
				var table = [];
				
				/**************************你点的菜****************************/
				function yourDish(checked, goodsId, goodsName, goodsUnitPrice) {
					
					var goodsN = goodsName; //菜名
					
					var count = addMenu(checked, goodsId, goodsN, goodsUnitPrice); //添加菜单(显示在菜单栏)
					
					/**算算要多少钱**/
					menuCount(checked, goodsUnitPrice, count);
					statistial();
					
					dishJSON_Add(checked, goodsId, goodsN, goodsUnitPrice);//json格式的菜
				}
				
				/**************************JSON格式的菜****************************/
				/**dist:{商品名称、商品单价、商品Id、商品数量}，订单类型、餐桌名称、用餐时间、送货地址、备注、所以菜数量、订单总价、、服务生编号**/
				function dishJSON_Add(checked, goodsId, goodsName, goodsUnitPrice){
					var amount = 1;//默认单个商品的数量为1
					if(checked) {
						//如果选中，放进dish
						dish.push("{goodsId: " + goodsId + ", goodsName: '" + goodsName + "', unitPrice:  " + goodsUnitPrice + ", amount: " + amount + "}");
					} else {
						dishJSON_delete(goodsId);
					}
				}
				/**根据菜Id删除菜**/
				function dishJSON_delete(goodsId) {
					for(var i = 0; i < dish.length; i++) {
						var goods = eval('('+dish[i]+')');
						if(goods.goodsId == goodsId) {
							dish.splice(i,1);//删除放弃选中的
						}
					}
					
				}
				
				/**修改dish的amount**/
				function dishJSON_Amount_Update(goodsId, goodsName, unitPrice, amount) {
					dishJSON_delete(goodsId);
					dish.push("{goodsId: " + goodsId + ", goodsName: '" + goodsName + "', unitPrice:  " + unitPrice + ", amount: " + amount + "}");
				}
				
				/**统计菜数和价格**/ //operation:是添加还是删除
				function menuCount(operation, goodsUnitPrice, count) {
					if(operation) {
						countMenu = countMenu + 1;//添加一个菜
						totalPrice = Number(totalPrice) + Number(goodsUnitPrice);//统计价格
					} else {
						countMenu = Number(countMenu) - Number(count);//减去N个菜
						totalPrice = Number(totalPrice) - Number(goodsUnitPrice) * Number(count);
					}
				}
				function statistial() {
					$("#orderMsg").html("");
					$("#orderMsg").html("共"+ countMenu +"个菜/总共：" + totalPrice + "元");
				}
				
				/**传给我数量和单价**/
				function spinnerTotalPrice(spinnerId, count, unitPrice, goodsName) {
					//自定义属性，保存前一次的value
					var beforeCount = $("#" + spinnerId).attr("preValue"); 
					var thisGoodsId = $("#" + spinnerId).attr("thisGoodsId");
					
					var actCount = count;//实际份数，小于或等于0，设为默认值1份
					if(count <=0 || isNaN(actCount)) {
						$("#" + spinnerId).prop("value", "1");//将页面显示改为1，默认值
						actCount = 1;
					}
					
					dishJSON_Amount_Update(thisGoodsId, goodsName, unitPrice, actCount);
					
					//计算价格
					totalPrice = Number(totalPrice) + Number(unitPrice)*Number(actCount) - Number(unitPrice)*Number(beforeCount);
					countMenu = Number(countMenu) + Number(actCount) - Number(beforeCount);
					beforeCount = actCount;
					$("#" + spinnerId).attr("preValue", beforeCount);
					statistial();
				}
				
				
				/**添加菜单(显示在菜单栏)**/
				function addMenu(isCheck, goodsId, goodsName, goodsUnitPrice) {
					if(isCheck) {
						var menuStr = "<p id='addMenu" + goodsId +"'>" + goodsName + "￥" + goodsUnitPrice 
							+ "<label for='spinner" + goodsId + "'>X</label><input id='spinner" + goodsId 
							+ "' name='share" + goodsId +"' value='1' size='2' preValue='1' thisGoodsId='" + goodsId + "' onblur='spinnerTotalPrice(this.id, this.value, " + goodsUnitPrice + ", \"" + goodsName + "\")'/>份</p>";
						$("#booked").append(menuStr);//选中的菜显示在菜单栏上
						goodsSpinner("spinner" + goodsId);//限制点菜至少一份
						return 1;
					} else{
						var id = "spinner" + goodsId;
						var result = $("#"+id).prop("value"); //被删除掉之前先获取它的value
						$("#addMenu" + goodsId).remove(); //把你删掉
						return result;
					}
				}
				//点菜无封顶，最少只能点一份
				function goodsSpinner(spinnerId) {
					$( "#" + spinnerId ).spinner({
						spin: function( event, ui ) {
							if ( ui.value <= 0 ) {
								$( this ).spinner( "value", 1 );
								return false;
							}
						}
					});
				}
				
				//我选中的桌子
				function yourTable (checked, tableId, tableName) {
					
					if(checked) {
						$("#boodMsgTurn").append("<label id='selLab" + tableId + "'>" + tableName + ";</label>");
					} else {
						$("#selLab" + tableId).remove();
					}
					getJsonTable(checked, tableId, tableName);
				}
				//json格式的table
				function getJsonTable(checked, tableId, tableName) {
					if(checked) {
						table.push("{tableId: '" + tableId + "', tableName: '" + tableName + "'}");
					} else {
						for(var i = 0; i < table.length; i++) {
							var t = eval("(" + table[i] + ")");
							if(t.tableId == tableId)
								table.splice(i, 1);
						}
					}
				}
				
				/**菜单的类型（显示）**/
				$(function(){
					$(".menuTp").click(function(){
						var mType = $("input[name=orderCategory]:checked").prop("value");
						//var mType = $("input:checked").attr("value");
						
						if(mType == "TABLE_ORDERING") {
							$("#boodMsgTurn").html("");
							$("#accordion").show();
							//showMember();
							bookOrMeal();
							
							
						} else if(mType == "BOOKING_ORDERING") {
							/**预订需要时间**/
							$("#boodMsgTurn").html("");//清空div
							$("#accordion").show();
							//showMember();
							mealTime();
							bookOrMeal();
							
						} else if(mType == "TAKE_OUT") {
							$("#boodMsgTurn").html("");
							
							//showMember();
							var addStr = "<div style='padding-bottom:2px;'>&nbsp;外送地址:<input type='text' size='37' name='deliveryAddress' id='deliveryAddress' value='' class='text ui-widget-content ui-corner-all' /></div>";
							$("#boodMsgTurn").append(addStr);
							mealTime();
							
							for(var i = 0; i < table.length; i++) {
								var t = eval("(" + table[i] + ")");
								$("label[for="+t.tableName+"]").removeClass("ui-corner-left ui-state-active");
								
							}
							$("#accordion").hide();
							table = [];
						} else {
							$("#bookMsg").html("");
						}
					});
				});
				
				function bookOrMeal() {
					var tabHtml = "&nbsp;座&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 位:";
					for(var i = 0; i < table.length; i++) {
						var t = eval("(" + table[i] + ")");
						tabHtml = tabHtml + "<label id='selLab" + t.tableId + "'>" + t.tableName + ";</label>";
					}
					$("#boodMsgTurn").append(tabHtml);
				}
				function mealTime() {
					$("#boodMsgTurn").append("<div style='margin-bottom:2px;'><input type='text' name='mealTimes' value='' readonly = 'readonly'/></div>");
					$("input[name=mealTimes]").ligerDateEditor({ showTime: true, label: '用餐时间', labelAlign: 'right' });
				}
				function showMember() {
					var addMember = "<div style='padding-bottom:2px;'>&nbsp;会&nbsp;&nbsp;员&nbsp;&nbsp;号:<input type='text' size='15' name='memberNo' id='memberNo' value='' class='text ui-widget-content ui-corner-all' onblur=getMemberByNo(this.value) />" + 
					"&nbsp;姓名:<input type='text' size='10' name='memberName' id='memberName' value='' class='text ui-widget-content ui-corner-all' readonly = 'readonly'/></div>";
					$("#bookMsg").append(addMember);
				}
				
				/**异步根据菜单类别回去查询菜单的详情**/
				/***************菜名不能有，、/（）等等**/
				function showMenuDetails(menuCategoryId, code, isFirst) {

					if(isFirst) return false;
					var isShow = $("#menu" +menuCategoryId).attr("isShow");
					if(isShow) return false;
					
					var categoryCode = code;
					
					$.ajax({
						url: "showGoods/" + menuCategoryId,
						type: "post",
						dataType: "json",
						success: function(data){
							var goodss = eval(data);
							
							var topHtml = "<div id='menu" + menuCategoryId + "' isShow='true' style='margin:2px;'>" +
								"<table width='100%' height='100%' align='center' border='0'>";
							var bottomHtml = "</table></div>";
							var bodyHtml = "";
							var goodsLength = goodss.length;
							
							for(var i = 0; i < goodsLength; i += 3) {
								var goods = goodss[i];
								var goods1 = goodss[i+1];
								var goods2 = goodss[i+2];
								
								bodyHtml = bodyHtml + "<tr>";
								
								if (i < goodsLength) {
									bodyHtml = bodyHtml +
										"<td>" +
										"<input type='checkbox' name='goodsName' id='" + goods.goodsName + "' value='" + goods.goodsName + "' " +
			                                "onclick='yourDish(this.checked, " + goods.goodsId + ", \"" + goods.goodsName + "\", " + goods.goodsUnitPrice + ")' />" +
			                            "<label for='" + goods.goodsName + "' style='width:178px;'>" +
			                            	goods.goodsName + "-￥" + goods.goodsUnitPrice +
			                            "</label>" +
									"</td>";
									if((i+1) < goodsLength) {
										bodyHtml = bodyHtml +
										"<td>" +
										"<input type='checkbox' name='goodsName' id='" + goods1.goodsName + "' value='" + goods1.goodsName + "' " +
	                                   		"onclick='yourDish(this.checked, " + goods1.goodsId + ", \"" + goods1.goodsName + "\", " + goods1.goodsUnitPrice + ")' />" +
	                            		"<label for='" + goods1.goodsName + "' style='width:178px;'>" +
	                            			goods1.goodsName + "-￥" + goods1.goodsUnitPrice +
	                            		"</label>" +
									"</td>";
										if((i+2) < goodsLength){
											bodyHtml = bodyHtml +
											"<td>" +
											"<input type='checkbox' name='goodsName' id='" + goods2.goodsName + "' value='" + goods2.goodsName + "' " +
                               					"onclick='yourDish(this.checked, " + goods2.goodsId + ", \"" + goods2.goodsName + "\", " + goods2.goodsUnitPrice + ")' />" +
                        					"<label for='" + goods2.goodsName + "' style='width:178px;'>" +
                        						goods2.goodsName + "-￥" + goods2.goodsUnitPrice +
                        					"</label>" +
										"</td>";
										}
									}
								}
								bodyHtml = bodyHtml + "</tr>";
							}
							var result = topHtml + bodyHtml + bottomHtml;
							$("#" + categoryCode).html("");
						    $("#" + categoryCode).append(result);	
							$("#menu" + menuCategoryId).buttonset();
						},
						error: function(){
							alert("AJax Error!!!");
						}
					});
				}
				
				/**异步根据餐桌类别回去查询餐桌的详情**/
				function showTableDetails(tableCategoryId, code, isFirst) {
					if(isFirst) return false;
					var isShow = $("#dining" +tableCategoryId).attr("isShow");
					if(isShow) return false;
					
					var tableCode = code;
					
					$.ajax({
						url: "showTable/" + tableCategoryId,
						type: "post",
						dataType: "json",
						success: function(data){
							var tables = eval(data);
							
							var topHtml = "<div id='dining" + tableCategoryId + "' isShow='true' style='margin:2px;'>" +
								"<table width='100%' height='100%' align='center' border='0'>";
							var bottomHtml = "</table></div>";
							var bodyHtml = "";
							var tablesLength = tables.length;
							for(var i = 0; i < tablesLength; i += 3) {
								var table0 = tables[i];
								var table1 = tables[i+1];
								var table2 = tables[i+2];
								
								bodyHtml = bodyHtml + "<tr>";
								
								if (i < tablesLength) {
									bodyHtml = bodyHtml +
										"<td>" +
										"<input type='checkbox' name='diningTableName' id='" + table0.diningTableName + "' " +
			                                "onclick='yourTable(this.checked, " + table0.diningTableId + ", \"" + table0.diningTableName + "\")' />" +
			                            "<label for='" + table0.diningTableName + "'>" +
			                            	table0.diningTableName +
			                            "</label>" +
									"</td>";
									if((i+1) < tablesLength) {
										bodyHtml = bodyHtml +
										"<td>" +
										"<input type='checkbox' name='diningTableName' id='" + table1.diningTableName + "' " +
	                                   		"onclick='yourTable(this.checked, " + table1.diningTableId + ", \"" + table1.diningTableName + "\")' />" +
	                            		"<label for='" + table1.diningTableName + "'>" +
	                            			table1.diningTableName +
	                            		"</label>" +
									"</td>";
										if((i+2) < tablesLength){
											bodyHtml = bodyHtml +
											"<td>" +
											"<input type='checkbox' name='diningTableName' id='" + table2.diningTableName + "' " +
                               					"onclick='yourTable(this.checked, " + table2.diningTableId + ", \"" + table2.diningTableName + "\")' />" +
                        					"<label for='" + table2.diningTableName + "'>" +
                        						table2.diningTableName +
                        					"</label>" +
										"</td>";
										}
									}
								}
								bodyHtml = bodyHtml + "</tr>";
							}
							
							var result = topHtml + bodyHtml + bottomHtml;
							$("#" + tableCode).html("");
						    $("#" + tableCode).append(result);	
							$("#dining" + tableCategoryId).buttonset();
						},
						error: function(){
							alert("List Table AJax Error!!!");
						}
					});
				}
				
				/**根据会员号获取会员信息**/
				function getMemberByNo(memberNo) {
					if(memberNo.trim() == "" || memberNo == null) {
						setMemberMsgNull();
						return false;
					}
					$.ajax({	
						url: 'getMember/' + memberNo.trim(),
						type: 'post',
						dateType: 'json',
						success: function(data) {
							var member = eval(data);
							if(member == null) {
								setMemberMsgNull();
							} else {
								$("#memberName").prop("value", member.memberName);
								$("#deliveryAddress").prop("value", member.address);
								$("input[name=memberId]").prop("value", member.memberId);
							}
						},
						error: function() {
							alert("非法操作！");
						}
					});
				}
				function setMemberMsgNull() {//设置会员信息为空
					$("#memberName").prop("value", "");
					$("#deliveryAddress").prop("value", "")
					$("input[name=memberId]").prop("value", "");
				}
			
				
                $(function ()
                {
                    $("#layout1").ligerLayout({ leftWidth: 280, rightWidth:200,allowLeftCollapse:false, heightDiff:0});
					$("#menu").buttonset();
					$("#dining").buttonset();
					$("#menuType").buttonset();
					$(document).tooltip();
					<!-- submit a button -->
					$("button").button();
					$("#orderButton").button().click(function(){
						var order = "";
						order = checkOrders();
						if(order != ""){
							$.ligerDialog.open({ 
								url: 'showOrderDetails?orderStr=' + order, 
								height: 450, width: 595, title: '订单明细', isResize: true,
								buttons: [{ text: '确定下单', 
									onclick: function (item, dialog) { 
										saveOrder(order);
									}},
									{ text: '取消', onclick: function (item, dialog) { window.location.reload(true); } },
								    { text: '返回', onclick: function (item, dialog) { dialog.close(); } }]
							});
						}
					});
                });
                
                function saveOrder(order) {
                	$.ajax({
						url: "addOrder?orderStr=" + order,
						type: "post",
						dataType: "json",
						success: function(data){
							var success = eval(data);
							if(!success) {
								alert("操作失败，请及时联系管理员！！");
							}
							window.location.reload(true);
						},
						error: function(){
							alert("系统出错了，请联系管理员！");
						}
					});
                }
                
                /**验证订单**/
                function checkOrders() {
                	var oneOrder = "";
                	var orderCategory = $("input[name=orderCategory]:checked").prop("value");
                	var orderCategoryText = $("input[name=orderCategory]:checked").attr("typeText");
					var mealT = $("input[name=mealTimes]").prop("value");
					var remark = $("#remark").prop("value");
					var deliveryAddress = $("#deliveryAddress").prop("value");
					
					/**会员的信息**/
					var memberNo = $("input[name=memberNo]").prop("value");
					var memberName = $("input[name=memberName]").prop("value");
					var memberId = $("input[name=memberId]").prop("value");
					
                	if(dish.length == 0) {
                		$("#checkOrderMsg").html("<font class='check'>请您点菜！</font>");
                		return oneOrder;
                	}
                	
                	/**订单的三个状态：TABLE_ORDERING BOOKING_ORDERING  TAKE_OUT**/
                	if(orderCategory == "TABLE_ORDERING" || orderCategory == "BOOKING_ORDERING") {
                		if(table.length == 0) {
                			$("#checkOrderMsg").html("<font class='check'>请选择指定的餐桌！</font>");
                			return oneOrder;
                		}
                	} 
					if(orderCategory == "BOOKING_ORDERING" || orderCategory == "TAKE_OUT") {
                		if(mealT == "") {
                			$("#checkOrderMsg").html("<font class='check'>请选择用餐时间！</font>");
                			$("input[name=mealTimes]").focus();
                			return oneOrder;
                		}
                	} 
					if(orderCategory == "TAKE_OUT") {
                		if(deliveryAddress == "") {
                			$("#checkOrderMsg").html("<font class='check'>请输入外送地址！</font>");
                			$("#deliveryAddress").focus();
                			return oneOrder;
                		}
                	}
					if(memberNo.trim() != "" ) {
						if(memberName == ""){
							$("#checkOrderMsg").html("<font class='check'><ul><li>会员号非法，没有对应的会员姓名！或者不是会员，可令会员号为空！<li></font>");
							return oneOrder;
						}
					}
					$("#checkOrderMsg").html("");
                	if(deliveryAddress == undefined)
						deliveryAddress = "";
					
					if(mealT == undefined)
						mealT = "";
					
					if(memberNo == undefined)
						memberNo = "";
					
					if(memberName == undefined)
						memberName = "";
					
					oneOrder = "{goods: [" +dish + "], table: [" +  table + "], totalPrice: "
						+ totalPrice + ", amount: " + countMenu + ", deliveryAddress: '" 
						+ deliveryAddress + "', orderCategory: '" + orderCategory + "', mealTime: '"
						+ mealT + "', remark: '" + remark + "', memberNo: '" + memberNo + "', memberName: '" + memberName 
						+ "', categoryText: '" + orderCategoryText + "', memberId: '" + memberId + "'}";
					return oneOrder;
                }
                
				$(function(){
					$("#accordion").accordion();//餐桌
					$("#accordion2").accordion();//菜单
				});
			
         </script> 
        <style type="text/css"> 
            body{ padding:5px; margin:0;}
            #layout1{  width:100%;margin:0; padding:0; }  
			#menu label{ width:178px;}
			#menuType label{ width:88px;}
			#menuType{ margin-left:5px; margin-top:3px; height:33px;}
			#booked{ margin-left:5px; margin-top:5px; height:120px; overflow:auto;}
			#bookMsg{ margin-left:5px; margin-bottom:3px; margin-right:5px;}
			#orderMsg{ margin-left:5px; margin-top:2px; height:28px;}
			#menuRemark{margin-left:5px; margin-top:2px; height:36px;}
			#accordion, #accordion2{ padding-top:2px;}
			.check{ font-size: 18px; font-weight: 900; color: red;}
        </style>
</head>

 <body style="padding:5px; overflow: auto;">  
 	<!-- <form action="" method="post" onsubmit="a()"> -->
      <div id="layout1">
      <!--  订单项  -->
            <div position="left" title="订单项">
               <!-- <p class="ui-widget-content">----订单类型</p> -->
                <div id="menuType">
                    <input type="radio" class="menuTp" name="orderCategory" value="TABLE_ORDERING" typeText="餐桌点餐" id="tableMeal" checked="checked" />
                    	<label for="tableMeal">餐桌点餐</label>
                    <input type="radio" class="menuTp" name="orderCategory" value="BOOKING_ORDERING" typeText="预定点餐" id="bookingMeal" />
                    	<label for="bookingMeal">预定点餐</label>
                    <input type="radio" class="menuTp" name="orderCategory" value="TAKE_OUT" typeText="外卖点餐" id="outsideMeal"/>
                    	<label for="outsideMeal">外卖点餐</label>
                </div>
                
                <div id='bookMsg'>
                	<div style='padding-bottom:2px;'>&nbsp;会&nbsp;&nbsp;员&nbsp;&nbsp;号:<input type='text' size='15' name='memberNo' id='memberNo' value='' class='text ui-widget-content ui-corner-all' onblur='getMemberByNo(this.value)' />
						姓名:<input type='text' size='10' name='memberName' id='memberName' value='' class='text ui-widget-content ui-corner-all' readonly = 'readonly'/>
						<input type="hidden" name="memberId" value = "">
					</div>
					<div id="boodMsgTurn">
                	&nbsp;座&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;位:
                	</div>
                </div>
                
                <p class="ui-widget-content">----已点菜单栏</p>
                <div id="booked">
                </div>
                
                <p class="ui-widget-content">----备注</p>
                <div id="menuRemark">
                   <textarea class="textarea ui-widget-content ui-corner-all" id="remark" name="remark" cols="45" rows="1"></textarea>
                </div>
                
                <p class="ui-widget-content">----统计</p>
                <div id="orderMsg" style=" font-size:18px; font-weight:600;">
                   共0个菜/总共：0.0元
                </div>
                
                <p class="ui-widget-content">----订单操作</p>
                <div id="orderMsg">
                <center>
                    <button id="orderButton" name="booking" value="booking">下单</button>
                    <button id="clearing" name="clearing" value="clearing" onclick="window.location.reload(true);">清空</button>
                </center>
                </div>
                <div id ="checkOrderMsg" style="margin: 5px;">
				</div>
            	
            </div>
             <!-- 订单项END -->
       <!-- 菜单 -->     
            <div position="center" title="菜单" style="overflow: auto;"><!-- style="overflow: auto;"-->
               
                    <div id="accordion2">
	                    <c:forEach items="${categories }" var="menuCategory" varStatus="menuStatus" >
	                    	<h3 onclick="showMenuDetails(${menuCategory.dictionaryId}, '${menuCategory.categoryCode }', ${menuStatus.first })">${menuCategory.categoryName }</h3>
	                    	<c:choose>
		                    	<c:when test="${menuStatus.first }">
									<div id="${menuCategory.categoryCode }">
										<!--start 菜名-->
			                        	<div id="menu" isShow="false" style="margin:2px; height: 250px;">
			                             <table width="100%" align="center" border="0">
			                             	<c:forEach items="${goodss }" var="goods" step="3" varStatus="goodsStatus">
			                             		<tr>
			                             			<c:set var="goodsCount0" scope="session">${goodsStatus.index }</c:set>
			                             			<c:set var="goodsCount1" scope="session">${goodsStatus.index+1 }</c:set>
			                             			<c:set var="goodsCount2" scope="session">${goodsStatus.index+2 }</c:set>
			                             			
			                             			<c:if test="${goodss[goodsCount0].goodsName ne null }">
				                                    <td>
				                                    	<input type="checkbox" name="goodsName"	id="${goodss[goodsCount0].goodsName }"
				                                    		value="${goodss[goodsCount0].goodsName }" 
				                                    		onclick="yourDish(this.checked, ${goodss[goodsCount0].goodsId }, '${goodss[goodsCount0].goodsName }', ${goodss[goodsCount0].goodsUnitPrice })" />
				                                    	<label for="${goodss[goodsCount0].goodsName }">
				                                    		${goodss[goodsCount0].goodsName }-￥${goodss[goodsCount0].goodsUnitPrice }
				                                    	</label>
				                                    </td>
				                                    <c:if test="${goodss[goodsCount1].goodsName ne null }">
				                                    <td>
				                                    	<input type="checkbox" name="goodsName"
				                                    		id="${goodss[goodsCount1].goodsName }" value="${goodss[goodsCount1].goodsName }" 
				                                    		onclick="yourDish(this.checked, ${goodss[goodsCount1].goodsId }, '${goodss[goodsCount1].goodsName }', ${goodss[goodsCount1].goodsUnitPrice })"/>
				                                    	<label for="${goodss[goodsCount1].goodsName }">
				                                    		${goodss[goodsCount1].goodsName }-￥${goodss[goodsCount1].goodsUnitPrice }
				                                    	</label>
				                                    </td>
				                                    <c:if test="${goodss[goodsCount2].goodsName ne null }">
				                                    <td>
				                                    	<input type="checkbox" name="goodsName"
				                                    		id="${goodss[goodsCount2].goodsName }" value="${goodss[goodsCount2].goodsName }" 
				                                    		onclick="yourDish(this.checked, ${goodss[goodsCount2].goodsId }, '${goodss[goodsCount2].goodsName }', ${goodss[goodsCount2].goodsUnitPrice })"/>
				                                    	<label for="${goodss[goodsCount2].goodsName }">
				                                    		${goodss[goodsCount2].goodsName }-￥${goodss[goodsCount2].goodsUnitPrice }
				                                    	</label>
				                                    </td>
				                                    </c:if>
				                                    </c:if>
				                                    </c:if>
			                                	</tr>
			                             	</c:forEach>
			                            </table>
			                        	</div>
			                        	<!--end 菜名-->
									</div>
								</c:when>
								<c:otherwise>
									<div id="${menuCategory.categoryCode }">
									</div>
								</c:otherwise>
	                    	</c:choose>
	                    </c:forEach>    
                    </div>
            </div>
            
             <!-- 菜单END -->
            <!-- 餐桌 -->
            <div position="right" id="menuDining" title="餐桌" style="overflow: auto;">
                <div id="accordion">
                <c:forEach items="${tableCategories }" var="tableCategory" varStatus="tableStatus" >
	            	<h3 onclick="showTableDetails(${tableCategory.dictionaryId}, '${tableCategory.categoryCode }', ${tableStatus.first })">
	            		${tableCategory.categoryName }
	            	</h3>
	                	<c:choose>
		            	<c:when test="${tableStatus.first }">
							<div id="${tableCategory.categoryCode }">
			            	<div id="dining">
			            	
			                	<table width="100%" height="100%" border="0">
			                         
			                         <c:forEach items="${tables }" var="table" step="3" varStatus="tableStatus">
			                             		<tr>
			                             			<c:set var="tCount0" scope="session">${tableStatus.index }</c:set>
			                             			<c:set var="tCount1" scope="session">${tableStatus.index+1 }</c:set>
			                             			<c:set var="tCount2" scope="session">${tableStatus.index+2 }</c:set>
			                             			
			                             			<c:if test="${tables[tCount0].diningTableName ne null }">
				                                    <td>
				                                    	<input type="checkbox" name="diningTableName" id="${tables[tCount0].diningTableName }" value=""
				                                    		onclick="yourTable(this.checked, ${tables[tCount0].diningTableId }, '${tables[tCount0].diningTableName }')" />
				                                    	<label for="${tables[tCount0].diningTableName }">
				                                    		${tables[tCount0].diningTableName }
				                                    	</label>
				                                    </td>
				                                    <c:if test="${tables[tCount1].diningTableName ne null }">
				                                    <td>
				                                    	<input type="checkbox" name="diningTableName"
				                                    		id="${tables[tCount1].diningTableName }"
				                                    		onclick="yourTable(this.checked, ${tables[tCount1].diningTableId }, '${tables[tCount1].diningTableName }')"/>
				                                    	<label for="${tables[tCount1].diningTableName }">
				                                    		${tables[tCount1].diningTableName }
				                                    	</label>
				                                    </td>
				                                    <c:if test="${tables[tCount2].diningTableName ne null }">
				                                    <td>
				                                    	<input type="checkbox" name="diningTableName"
				                                    		id="${tables[tCount2].diningTableName }" 
				                                    		onclick="yourTable(this.checked, ${tables[tCount2].diningTableId }, '${tables[tCount2].diningTableName }')"/>
				                                    	<label for="${tables[tCount2].diningTableName }">
				                                    		${tables[tCount2].diningTableName }
				                                    	</label>
				                                    </td>
				                                    </c:if>
				                                    </c:if>
				                                    </c:if>
			                                	</tr>
			                             	</c:forEach>
			                	</table>
			                </div>
							</div>
						</c:when>
						<c:otherwise>
							<div id="${tableCategory.categoryCode }">
							</div>
						</c:otherwise>
	                    </c:choose>
	            </c:forEach>  
                </div>
                
            </div>  
             <!-- 餐桌END 
             <div position="bottom"></div>-->
          </div> 
       <!-- </form> -->
       
       
    </body>
</html>
